<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app'
import { ref, watch,nextTick,defineExpose} from 'vue'
import goodsIcon from './goodsIcon.vue';
import { onReady } from '@dcloudio/uni-app';
import { router } from '@/utils/tools';
import { onReachBottom } from '@dcloudio/uni-app';
import { apiMyList } from '@/apis/my';
import { activityList } from "@/apis/user";
import goodsCard from './goodsCard.vue';


const pageNum = ref(1);
const pageSize = ref(10);
const leftList = ref([]);
const rightLists = ref([]);
const isMore = ref(false);

// const props = defineProps(['leftList', 'rightList', 'isMore']);
// const props = defineProps(['isMore']);

const props = defineProps({
  tagFlag: {
    type: Number,
    default: 0
  },
  searchText: {
    type: String,
    default: ''
  },
  criteriaId:{
    type: Number,
    default: 0
  }
})
watch(() => props.tagFlag, (newValue, oldValue) => {
  pageNum.value = 1;
  // pageList.value = [];
  leftList.value = [];
  rightLists.value = [];
  pageSize.value = 10;
  isMore.value = false;
  getProductPage()
});
watch(() => props.searchText, (newValue, oldValue) => {
  pageNum.value = 1;
  // pageList.value = [];
  leftList.value = [];
  rightLists.value = [];
  pageSize.value = 10;
  isMore.value = false;
  getProductPage()
});
const goodsitem = ref()
const goodsitemId = ref([])
const handleDetail = (row: any) => {
  // goodsitemId.value.push(row.id)
  nextTick(() => {
    goodsitemId.value = []
    goodsitem.value.map((item:any)=>{
      if(item.goodsCheckSelect === true){
        goodsitemId.value.push(item.goodsCheckId)
      }
    })
  })
  // router(`/pagesMerchand/stone-details?id=${row.id}&type=${'my'}`);
}

const getProductPage = async () => {
  let res = await activityList({
    pageNum: pageNum.value,
    pageSize: pageSize.value,
    title: props.searchText, //模糊查询奇石标题
    state: props.tagFlag ? props.tagFlag : '', //2-在售  3-已售 4-下架  5-我的收藏
    authentication: "", //认证
    activitiesId: props.criteriaId, //活动ID 必填
  });
  if (res.rows.length <= 0) {
    isMore.value = true;
    return false;
  }
  pageNum.value++;
  // pageList.value = res.rows;

  handlePageList(res.rows);

}
const handlePageList = (data: any) => {
  for (let i = 0; i < data.length; i++) {
    data[i].images = data[i].images.split(',');
    if (i % 2 === 0) {
      leftList.value.push(data[i]);
    } else {
      rightLists.value.push(data[i]);
    }
  }


}
onReachBottom((e: any) => {
  getProductPage();
})
// 左侧数据
// const leftList = ref([])
// // 右侧数据
// const rightList = ref([])

const getData = () => {
  // for (let i = 0; i < props.lists.length; i++) {
  //   if (i % 2 === 0) {
  //     leftList.value.push(props.lists[i])
  //   } else {
  //     rightList.value.push(props.lists[i])
  //   }
  // }
}
onLoad((options: any) => {
  // 初始化数据
  getData();

})
onReady(() => {
  getProductPage();
})
defineExpose({
  goodsitemId
});
</script>

<template>
  <view>

    <view class="wf flex">
      <view class="wf-left flex flex-1 flex-column">
        <!-- 瀑布流左边 -->
        <view v-for="(item, i) in leftList" :key="i" @click="handleDetail(item)">
          <goodsCard :goodsData="item" ref="goodsitem"> </goodsCard>

        </view>

      </view>
      <view class="flex wf-center"></view>

      <view class="wf-right flex flex-1 flex-column">
        <view v-for="(item, i) in rightLists" :key="i" @click="handleDetail(item)" class="">
          <goodsCard :goodsData="item" ref="goodsitem"> </goodsCard>
        </view>

      </view>
      <!--  -->
    </view>
    <uv-empty mode="list" v-if="leftList.length <= 0 && rightLists.length <= 0"></uv-empty>
    <block v-if="leftList.length > 0 || rightLists.length > 0">
      <uv-load-more status="nomore" fontSize="12px" nomoreText="人家也是有底线哒" :line="true" v-if="isMore" />
    </block>
  </view>

</template>

<style scoped lang="scss">
.wf {
  .wf-center {
    width: 20rpx;
  }

  .wf-left {
    overflow: hidden;
  }

  .wf-right {
    overflow: hidden;

  }


}
</style>
